import React from 'react';
class Child extends React.Component{
    state={
        msg:'45659999999999999999999'
    }
    render(){
        return(
            <div>
                <h2>{this.state.msg}</h2>
            </div>
        )
    }
}
class NotControl extends React.Component {
    //当结果交还给DOM进行处理的时候就称之为非受控组件
    //通过Ref来操作dom
    //Ref作用在react元素上可以获取真实dom元素
//Ref作用在子组件上，可以获取子组件的实例的引用

    myRef = React.createRef() //先创建一个ref
    myRef2 = React.createRef()
    handleClick = () => {
        console.log(this.myRef); //打印的是input这个元素
        this.myRef.current.focus() //点击获取焦点
        console.log(this.myRef2); //打印的是子组件
        this.myRef2.current.state.msg = '5656'
        this.setState({})
    }
    render() {
        return (
            <fieldset>
                <legend>ref</legend>
                <input type="text" ref={this.myRef} />
                <button onClick={this.handleClick}>点击</button>
                <Child ref={this.myRef2}/>
            </fieldset>
        )
    }
}
export default NotControl